import Scene from './scene'
import BackGround from '../runtime/background'
import Sprite from '../base/sprite'
import util from '../base/util'
import rankPanel from '../base/switchPanel'

const screenWidth = window.innerWidth
const screenHeight = window.innerHeight

export default class AstraySingleScene extends Scene {
  constructor(aParent, aOpenID) {
    super(aParent, aOpenID)
    this.bg = new BackGround.astraySingle()
    this.bindControl = this.control.bind(this)
    this.start_btn = new Sprite("images/astray/buttons.png", screenWidth * 0.6, screenHeight * 0.08, screenWidth * 0.2, screenHeight * 0.81, 2,
    {sx: 248, sy: 276, sw: 200, sh: 170, texts: [{value: "开始挑战", font: screenHeight * 0.04 + 'px Arial', pos: [screenWidth * 0.16, screenHeight * 0.056], color: "#ffffff"}]}, "single_start")
    this.return_btn = new Sprite("images/astray/buttons.png", screenWidth * 0.6, screenHeight * 0.08, screenWidth * 0.2, screenHeight * 0.9, 2,
    {sx: 470, sy: 276, sw: 200, sh: 170, texts: [{value: "返回", font: screenHeight * 0.04 + 'px Arial', pos: [screenWidth * 0.23, screenHeight * 0.05], color: "#ffffff"}]}, "single_return")
    this.rank = new rankPanel("rank_list", {left: 0.1, height: 0.7, top: 0.1}, {height: 0.1, top: 0.4})
  }

  initEnter(){
    Scene.prototype.enter.apply(this, arguments)
    canvas.addEventListener('touchstart', this.bindControl)
  }
  async enter(){
    let res = await util.request({
      api: "astray/listrecords",
      data: {
        player: this.openid,
        type: 'single'}})
    let rec = res.data
    rec.sort((p, n) => {  //get best stage
      return n.stage - p.stage
    })
    let cur = rec.length ? rec[0].stage : 0
    this.rank.enterSwitch3D(cur, 1, cur + 1)
    this.initEnter()
  }

  leave(){
    canvas.removeEventListener('touchstart', this.bindControl)
  }

  control(e){
    e.preventDefault()
    const x = e.touches[0].clientX
    const y = e.touches[0].clientY
    if (this.start_btn.pointIsIn(x , y)){
      this.toNextScene("train", {mode: "single", stage: this.rank.current_stage})
    }else if (this.return_btn.pointIsIn(x, y)){
      this.toNextScene("start")
    }else{ 
      this.rank.controlSwitch3D(x, y)
    }
  }

  update(){
    return Scene.prototype.update.apply(this, arguments)
    // this.bg.update(ctx)
  }

  async __getListRecords(){
    let res = await util.request({
      api: "astray/listrecords",
      data: {
        stage: this.rank.current_stage,
        type: 'single'}})
    let rec = res.data
    rec.sort((p, n) => {  //get best stage
      return p.cost - n.cost
    })
    let txts = [{value: "等级" + this.rank.current_stage, font: screenHeight * 0.06 + 'px Arial', pos: [screenWidth * 0.27, screenHeight * 0.07], color: "#ffffff"}]
    if (rec.length){
      txts.push({value: "排名", font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.08, screenHeight * 0.14], color: "#ffffff"})
      txts.push({value: "用户", font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.34, screenHeight * 0.14], color: "#ffffff"})
      txts.push({value: "耗时", font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.62, screenHeight * 0.14], color: "#ffffff"})
      for (let i = 0; i < 6 && i < rec.length; ++i){
        let idx = i
        let clr = "#ffffff"
        let usr = rec[idx].player.substr(0, 3) + "**" + rec[idx].player.substr(rec[idx].player.length - 3, 3)
        if (rec[idx].player == this.openid){
          clr = "#ff0000"
          usr = "你的位置"
        }
        let ht = screenHeight * 0.14 + (i + 1) * screenHeight * 0.05
        txts.push({value: i + 1, font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.1, ht], color: clr})
        txts.push({value: usr, font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.28, ht], color: clr})
        txts.push({value: rec[idx].cost, font: screenHeight * 0.03 + 'px Arial', pos: [screenWidth * 0.61, ht], color: clr})
      }
    }else
      txts.push({value: "没有记录", font: screenHeight * 0.04 + 'px Arial', pos: [screenWidth * 0.28, screenHeight * 0.34], color: "#ffffff"})
    return txts
  }

  async render(ctx){
    Scene.prototype.render.apply(this, arguments)
    this.bg.render(ctx)
    this.start_btn.drawToCanvas(ctx)
    this.return_btn.drawToCanvas(ctx)
    let txts = []
    if (!this.rank.rank_updated)
      txts = await this.__getListRecords()
    await this.rank.renderSwitch3D(ctx, txts)
    ctx.update()
  }
}